<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    
  </style>
</head>
<body>
  
</body>
<script>

  // 1. 三个异步程序，需要保证执行顺序
  // 2. 三个异步程序，需要能同时拿到结束后的数据

  ajax("异步1", res1=>{
    // console.log(res1)
    ajax("异步2", res2=>{
      // console.log(res2)
      ajax("异步3", res3=>{
        console.log(res1, res2, res3);
      })
    })
  })

  // 回调地狱：多个异步程序的回调函数的嵌套
  // 优势：保证异步的执行顺序，又可以拿到多个异步的结束
  // 缺点：可读性差，浪费性能，不方便调错

  function ajax(url, success){

    setTimeout(()=>{
      success(url + "请求成功，拿到数据");
    }, Math.random() * 1000);
    
  }

  
  // 异步未完成：正在进行时
  // 异步已完成：
    // 成功
    // 失败

  // 给每个异步，创建一个状态变量，用于记录当前异步的状态
  // 检测状态的变化
  // 只要状态发生了改变，结果必然是成功或失败


</script>
</html>